<div class="course-evaluate-container w100 h100">
  <!-- 督导评价主页面 -->
  <div class="content-box" [hidden]="mainStatus !== 1">
    <div class="table-top-search">
      <div class="top-search-left" style="float: right;">
        <label>
          <span>学年：</span>
          <nz-select style="width: 130px; margin-right: 20px" nzAllowClear nzPlaceHolder="请选择" [(ngModel)]="searchParams.schoolYear" (ngModelChange)="yearSearchChange($event)">
            <nz-option *ngFor="let item of yearList" [nzLabel]="item.schoolYear" [nzValue]="item.schoolYear"></nz-option>
          </nz-select>
        </label>
        <label>
          <span>学期：</span>
          <nz-select style="width: 130px; margin-right: 20px" nzAllowClear nzPlaceHolder="请选择" [(ngModel)]="searchParams.semesterId">
            <nz-option *ngFor="let item of semestSearch" [nzLabel]="item.semesterName" [nzValue]="item.id"></nz-option>
          </nz-select>
        </label>
        <label>
          课程编号：
          <input nz-input type="text" [(ngModel)]="searchParams.number" placeholder="请输入">
        </label>
        <label>
          课程名称：
          <input nz-input type="text" [(ngModel)]="searchParams.name" placeholder="请输入">
        </label>
        <label>
          任课教师：
          <input nz-input type="text" [(ngModel)]="searchParams.teacherName" placeholder="请输入">
        </label>
        <label>
          <!--授课班级：-->
          <!--<input nz-input type="text" [(ngModel)]="searchParams.classesName" placeholder="请输入">-->
          <button nz-button nzType="primary" (click)="clickSearch()">查询</button>
          <button nz-button nzType="default" (click)="resetSearch()">重置</button>
        </label>
      </div>
    </div>
    <div class="table-box">
      <ng-template #totalTemplate let-total>总共 {{ pageInfo.totalRecords? pageInfo.totalRecords:0 }} 条</ng-template>
      <nz-table
        nzBordered
        [nzData]="dataList"
        [nzFrontPagination]="false"
        [nzShowPagination]="true"
        [nzPageIndex]="pageInfo.first"
        [nzTotal]="pageInfo.totalRecords"
        [nzShowTotal]="totalTemplate"
        [nzPageSize]="pageInfo.rows"
        [nzLoadingDelay]="1"
        [nzPageSizeOptions]="[10,20,30,50,100]"
        [nzShowQuickJumper]="true"
        [nzShowSizeChanger]="true"
        (nzPageIndexChange)="changePageIndex($event)"
        (nzPageSizeChange)="changePageSize($event)"
        [nzWidthConfig]="nzWidthConfigs"
        [nzScroll]="{x: '1800px'}"
      >
        <thead>
        <tr>
          <th>序号</th>
          <th>学年</th>
          <th>学期</th>
          <th>课程编号</th>
          <th>课程名称</th>
          <th>课时</th>
          <th>课程类型</th>
          <th>开课部门</th>
          <th>任课教师</th>
          <th>工号</th>
          <th>职称</th>
          <!--<th>授课系部</th>-->
          <!--<th>授课专业</th>-->
          <!--<th>授课班级</th>-->
          <th>上课地点</th>
          <th>评价时间</th>
          <th>督导评价次数</th>
          <th nzRight="0px">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let item of dataList; let i = index">
          <td>{{i + 1}}</td>
          <td>{{ item.schoolYear}}</td>
          <td>{{ item.semesterName}}</td>
          <td>{{ item.number}}</td>
          <td>{{ item.name}}</td>
          <td>{{ item.sectionCount}}</td>
          <td>{{ item.type}}</td>
          <td>{{ item.startDeptName}}</td>
          <td>{{ item.teacherName}}</td>
          <td>{{ item.teacherNumber}}</td>
          <td>{{ item.teacherTitle}}</td>
          <!--<td>{{ item.teachDeptName}}</td>-->
          <!--<td>{{ item.majorName}}</td>-->
          <!--<td>{{ item.classesName}}</td>-->
          <td>{{ item.address}}</td>
          <td>{{ item.noLimitDate === 1?'不限时':item.superviseDateStr}}</td>
          <td>{{item.superviseEvaluateCount?item.superviseEvaluateCount:'-'}}</td>
          <td nzRight="0px">
            <span class="operaFont firOpera" (click)="edit(item.id)">详情</span>
              <span class="operaFont operaTao"
              nz-popconfirm
              nzOkType="danger"
              nzTitle="确定删除该记录吗?"
              (nzOnConfirm)="deleteOne(item.id)"
              nzPlacement="top"
              >删除</span>
          </td>
        </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
   <!-- 督导评价统计页面 -->
   <div class="content-box" *ngIf="mainStatus === 2">
    <div class="table-top-search flex" style="justify-content: space-between;align-items: center;">
      <div class="top-search-left" style="float: right;">
        <nz-dropdown [nzTrigger]="'hover'" class="m-r-sm">
          <button nz-dropdown nz-button nzType="primary"><i nz-icon nzType="upload" nzTheme="outline"></i>
            导出
          </button>
          <ul nz-menu>
            <li nz-menu-item (click)="exportShow(1)">导出选中</li>
            <li nz-menu-item (click)="exportShow(3)">导出全部</li>
          </ul>
        </nz-dropdown>
        <label>
          评课人员:
          <nz-select style="width: 130px; margin-right: 20px" [(ngModel)]="memberParams.checkerRole" nzPlaceHolder="请选择">
            <nz-option *ngFor="let item of assessmentPersonArr" [nzLabel]="item.label" [nzValue]="item.value"></nz-option>
          </nz-select>
        </label>
        <label>
          提交人：
          <input nz-input type="text" [(ngModel)]="memberParams.checker" placeholder="请输入">
          <button nz-button nzType="primary" (click)="clickSearch2()">查询</button>
          <button nz-button nzType="default" (click)="resetSearch2()">重置</button>
        </label>
      </div>
      <div class="back-info operaFont" (click)="back(1)">
        返回上一级<i class="fa fa-reply m-l-sm"></i>
      </div>
    </div>
    <div class="table-box">
      <ng-template #totalTemplate let-total>总共 {{ pageInfo2.totalRecords? pageInfo2.totalRecords:0 }} 条</ng-template>
      <nz-table
        nzBordered
        [nzData]="allList"
        [nzFrontPagination]="false"
        [nzShowPagination]="true"
        [nzPageIndex]="pageInfo2.first"
        [nzTotal]="pageInfo2.totalRecords"
        [nzShowTotal]="totalTemplate"
        [nzPageSize]="pageInfo2.rows"
        [nzLoadingDelay]="1"
        [nzPageSizeOptions]="[10,20,30,50,100]"
        [nzShowQuickJumper]="true"
        [nzShowSizeChanger]="true"
        (nzPageIndexChange)="changePageIndex($event)"
        (nzPageSizeChange)="changePageSize($event)"
        (nzCurrentPageDataChange)="currentPageDataChange($event)"
      >
        <thead>
        <tr>
          <th class="tableCheck"
              nzShowCheckbox
              [(nzChecked)]="isAllCheck"
              [nzIndeterminate]="isIndeterminate"
              (nzCheckedChange)="checkAll($event)"
              nzLeft="0px"
          ></th>
          <th>序号</th>
          <th>课程名称</th>
          <th>任课教师</th>
          <th>评价日期</th>
          <th>节次</th>
          <th>应到</th>
          <th>实到</th>
          <th>迟到</th>
          <th>缺课</th>
          <th>出勤率</th>
          <th>评课人员</th>
          <th>提交人</th>
          <th>总分</th>
          <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let item of allList; let i = index">
          <td
            nzShowCheckbox
            [(nzChecked)]="mapOfCheckedId[item.id]"
            (nzCheckedChange)="refreshStatus()"
            nzLeft="0px"
          ></td>
          <td>{{i + 1}}</td>
          <td>{{ item.courseName}}</td>
          <td>{{ item.teacherName}}</td>
          <td>{{ item.gmtCreate | date: 'yyyy-MM-dd HH:mm:ss' }}</td>
          <td>第{{ item.startSection}}节 - 第{{ item.endSection}}节</td>
          <td>{{ item.shouldCount}}</td>
          <td>{{ item.realCount}}</td>
          <td>{{ item.lateCount}}</td>
          <td>{{ item.missCount}}</td>
          <td>{{ item.attendance}} %</td>
          <td>{{ item.checkerRole}}</td>
          <td>{{ item.operator}}</td>
          <td>{{ item.score?item.score:'-'}}</td>
          <td>
            <span class="operaFont firOpera" (click)="clickEvaluated(item)">评价详情</span>
          </td>
        </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
  <!-- 评价详情页面 -->
  <div class="info-box w100 h100" *ngIf="mainStatus == 3">
    <div class="title flex flex-space-between flex-justify-start">
      评价详情
      <div class="back-info operaFont" (click)="back(2)">
        返回上一级<i class="fa fa-reply m-l-sm"></i>
      </div>
    </div>
    <div class="evaluate-table">
      <div class="table-head">教学督导评价记录表(专业课)</div>
      <div class="table-time flex flex-space-between flex-align-center">
        <div class="time">
          日期：{{evaluateObj.evaluteDate | date: 'yyyy-MM-dd'}}
        </div>
        <div class="section flex flex-justify-start flex-align-center">
          节次：
          <div class="section-box">
            第{{evaluateObj.startSection}}节至第{{evaluateObj.endSection}}节
          </div>
        </div>
      </div>
      <table class="table table-bordered">
        <tbody>
          <tr>
            <td class="th-t">课程名称</td>
            <td class="disabled">{{evaluateObj.courseName}}</td>
            <td class="th-t">任课教师</td>
            <td class="disabled">{{evaluateObj.teacherName}}</td>
            <td class="th-t">职称</td>
            <td class="disabled">{{evaluateObj.teacherTitle}}</td>
          </tr>
          <tr>
            <td class="th-t">系部</td>
            <td class="disabled">{{evaluateObj.teachDeptName}}</td>
            <td class="th-t">班级</td>
            <td class="disabled" [title]="evaluateObj.classesName">
              <div class="text-overflow" style="width: 200px;">{{evaluateObj.classesName}}</div>
            </td>
            <td class="th-t">专业</td>
            <td class="disabled">{{evaluateObj.majorName}}</td>
          </tr>
          <tr>
            <td class="th-t">上课地点</td>
            <td class="disabled">{{evaluateObj.address}}</td>
            <td class="th-t">应到</td>
            <td>{{evaluateObj.shouldCount}}</td>
            <td class="th-t">实到</td>
            <td>{{evaluateObj.realCount}}</td>
          </tr>
          <tr>
            <td class="th-t">迟到</td>
            <td>{{evaluateObj.lateCount}}</td>
            <td class="th-t">缺课</td>
            <td>{{evaluateObj.missCount}}</td>
            <td class="th-t">出勤率</td>
            <td class="disabled">{{evaluateObj.attendance}}%</td>
          </tr>
          <tr>
            <td class="th-t">评课人员</td>
            <td colspan="5">
              <div class="assessment-list">
                <nz-checkbox-group disabled [(ngModel)]="assessmentPersonArr"></nz-checkbox-group>
              </div>
            </td>
          </tr>
          <tr>
            <td class="th-t">主要教学内容</td>
            <td colspan="5">{{evaluateObj.content}}</td>
          </tr>
          <tr>
            <td class="th-t">评价项目</td>
            <td colspan="3" class="th-t">评价要点</td>
            <td class="th-t">评价记录</td>
            <td class="th-t">量化评分</td>
          </tr>
          <tr *ngFor="let item of evaluateProjectList; let i = index;">
            <td class="th-t" [rowSpan]="rowSpanIndexArr[i] > 0 ? rowSpanIndexArr[i] : 1"
                *ngIf="tdHiddenIndexArr.includes(i)">
              {{item.examClassifyName}}({{item.examClassifyScore}})
            </td>
            <td *ngIf="item.itemList" colspan="3" class="td-text-left">{{item.rowInfo.examItemName}}</td>
            <td *ngIf="!item.itemList" colspan="4">
              <input type="text" nz-input [(ngModel)]="item.content" placeholder="请输入">
            </td>
            <td *ngIf="item.itemList" class="flex-justify-start flex-align-center">
              {{item.rowInfo.value === '其他'?item.rowInfo.content:item.rowInfo.value}}
            </td>
            <td [rowSpan]="rowSpanIndexArr[i] > 0 ? rowSpanIndexArr[i] : 1"
                *ngIf="tdHiddenIndexArr.includes(i)">
                {{item.getScore}}
            </td>
          </tr>
          <tr>
            <td class="th-t">总分</td>
            <td colspan="5" class="disabled">
              {{totalScore}}
            </td>
          </tr>
          <tr *ngFor="let item of evaluateProjectNoScoreList;">
            <td class="th-t">{{item.examClassifyName}}</td>
            <td colspan="5">
              <input type="text" nz-input [(ngModel)]="item.rowInfo.content" placeholder="请输入">
            </td>
          </tr>
        </tbody>
      </table>

      <div style="display: flex;align-items: center;justify-content: space-between;padding: 0 20px;margin: 10px 0;font-size: 16px;margin-top:30px;">
        <div class="enclosure-box;display: flex">
          <span>附件：</span>
          <div>
            <div *ngFor="let item of evaluateObj.sourceList; let i = index;"
            style="color:#1890ff;margin-bottom: 20px;">
              <span  (click)="previewImg(item)">{{item.fileOriginalName}}</span>
              <span (click)="downLoad(item.id)" style="padding-left:60px;color: red;cursor: pointer;">下载</span>
            </div>
          </div>
        </div>
        <span style="margin-right: 6%;">督导签字：</span>
      </div>
    </div>
  </div>

  <nz-modal nzWidth="600px" [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
    <ng-template #modalContent>
      <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
    </ng-template>
  </nz-modal>
</div>
